<!DOCTYPE html>
<html lang="en">

<head>
    <title>内容库审核</title>
    <meta charset="utf-8">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover" />
    <meta http-equiv="Cache-Control" content="max-age=60" />
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/mescroll.css">
    <script src="js/flexible.js"></script>

</head>

<body>
    <div class="mescroll" id="mescroll" v-cloak>
        
        <div class="header">
            <div  :class=" index == bgColor ? 'active' :''" v-for="(item,index) in tableList" :key="index"
                @click="tabChange(index)">
                {{item}}
            </div>
        </div>
        <div class="search">
            <div class="searchItem">
                <img src="./images/search.png" alt="" class="searchOne">
                <form action="" class='inputStyle' @submit.prevent>
                    <input type="search" class='inputStyle' v-model="title"  @keyup.13="inputChange" 
                        placeholder="搜索标题">
                </form>
            </div>
            
        </div>
        <div class="content">
            <div class="content_item" id="datalist" v-for="(item,index) in contentList" :key="index"
                @click="detailsClick(item)">
                <div class="content_itemTop">
                    <div class="content_title" >{{ item.title}}</div>
                    <div class="content_time" v-if="styleFlag == 2" >{{ utils.formatTimeEn(item.createTime) }}
                    </div>
                    <div class="content_type" v-if="styleFlag != 2">
                        <div class="content_typeItem">提交人</div>
                        <div >{{ item.createBy }}</div>
                    </div>
                    <div class="content_type" v-if="styleFlag != 2">
                        <div class="content_typeItem">部门</div>
                        <div >{{item.createOuName}}</div>
                    </div>
                    <div class="content_types" v-if="styleFlag != 2"
                        :style="styleFlag == 1 ? 'border-bottom:1px dashed #D2D2D2;' : 'border-bottom:1px dashed #fff'">
                        <div class="content_typeItems">创建时间</div>
                        <div >{{ utils.formatTimeEn(item.createTime) }}</div>
                    </div>
                </div>
                <div class="content_footerTwo" v-if="styleFlag == 0">
                    <div style="color:#4FDD92" v-if=" item.auditStatusStr == '一审中'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#12C3B1" v-if=" item.auditStatusStr == '二审中'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#01D0FE" v-if=" item.auditStatusStr == '三审中'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#F53E56" v-if=" item.auditStatusStr == '一审驳回'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#F53E56" v-if=" item.auditStatusStr == '二审驳回'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#F53E56" v-if=" item.auditStatusStr == '三审驳回'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#1A61F5" v-if=" item.auditStatusStr == '提级审核中'">
                        {{item.auditStatusStr}}</div>
                    <div style="color:#F53E56" v-if=" item.auditStatusStr == '结束'">{{item.auditStatusStr}}
                    </div>
                    <div style="color:#F53E56" v-if=" item.auditStatusStr == '提级审核驳回'">
                        {{item.auditStatusStr}}</div>
                </div>
                <div class="content_itemBot" v-if="styleFlag == 1 ||styleFlag == 2">
                    <div class="content_type ">
                        <div class="content_typeItem examine">当前节点</div>
                        <div style="color:#4FDD92" v-if=" item.auditStatusStr == '一审中'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#12C3B1" v-if=" item.auditStatusStr == '二审中'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#01D0FE" v-if=" item.auditStatusStr == '三审中'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#F53E56" v-if=" item.auditStatusStr == '一审驳回'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#F53E56" v-if=" item.auditStatusStr == '二审驳回'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#F53E56" v-if=" item.auditStatusStr == '三审驳回'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#1A61F5" v-if=" item.auditStatusStr == '提级审核中'">
                            {{item.auditStatusStr}}</div>
                        <div style="color:#F53E56" v-if=" item.auditStatusStr == '结束'">{{item.auditStatusStr}}
                        </div>
                        <div style="color:#F53E56" v-if=" item.auditStatusStr == '提级审核驳回'">
                            {{item.auditStatusStr}}</div>
                    </div>
                    <div class="content_type" v-if="item.nowAuditBy">
                        <div class="content_typeItem examine">当前审核人</div>
                        <div>{{item.nowAuditBy}}</div>
                    </div>

                    <div class="content_footer" v-if="styleFlag == 1">
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '一审'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#4FDD92" > {{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '二审'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#FDC12D" >{{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '三审'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#01D0FE" >{{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '提级审核'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#5572FF" >{{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '完成'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#FDC12D" >{{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if=" item.myAuditNodeStr == '审核驳回'">
                            <div class="nodeStyle">我的审核节点</div>
                            <div style="color:#F53E56" >{{item.myAuditNodeStr}}
                            </div>
                        </div>
                        <div class="content_footer_item" v-if="item.myAuditNode == 6">
                            <div  style="color:#5572FF">提级审核</div>
                        </div>
                        <div class="content_footer_item " v-if="item.myAuditNode !== 6 && item.myAuditStatus == 1" >
                            <div style="color:#108EE9">审核通过
                            </div>
                        </div>
                        <div class="content_footer_item" v-if="item.myAuditNode !== 6 && item.myAuditStatus == 0">
                            <div  style="color:#F53E56">审核驳回
                            </div>
                        </div>
                        
                        
                    </div>
                </div>
            </div>
        </div>
        <div class="box" v-if="loading">
            <div class="boxLoading">
                <span style="--time:3">加</span>
                <span style="--time:4">载</span>
                <span style="--time:5">中</span>
                <span style="--time:9">.</span>
                <span style="--time:10">.</span>
                <span style="--time:10">.</span>
            </div>
        </div>
    </div>
</body>
<script src="js/vue.min.js"></script>
<script src="js/utils.js?v=2"></script>
<script src="js/axios.min.js"></script>
<script src="js/jquery-3.3.0.min.js"></script>
<script src="js/mescroll.min.js"></script>
<script>
    new Vue({
        el: '#mescroll',
        data() {
            return {
                searchTab: 1,
                MATokens: '',
                contentList: [],
                mescroll: null,
                rejectText: '',
                detailsId: '',
                tableList: ['待审核', '已审核', '我的申请'],
                bgColor: 0,
                loading: true,
                createTab: 0,//判断 是否走申请接口 1 走 0 不走 
                styleFlag: 0,
                title:'',
            }
        },
        mounted() {
            let MAToken = utils.getMaToken();
            if (utils.isEmpty(MAToken)) {
                return;
            }
            this.MATokens = MAToken;
            var _this = this;
            if (utils.getQueryString("bgColor")) {
                _this.bgColor = utils.getQueryString("bgColor")
                _this.styleFlag = utils.getQueryString("bgColor")

                if (_this.styleFlag == 0) {
                    _this.createTab = 0;
                    this.searchTab = 1;//待审核
                } else if (_this.styleFlag == 1) {
                    _this.createTab = 0;
                    this.searchTab = 2;//已审核
                } else if (_this.styleFlag == 2) {
                    _this.createTab = 1
                }
            }

            _this.mescroll = new MeScroll('mescroll', {
                down: {
                    use: false,
                    isLock: true,
                },
                up: {
                    empty: {
                        // icon: "images/nodata.png", //图标,默认null
                        tip: "暂无相关内容", //提示
                    },
                    isBounce: false,
                    callback: _this.upCallback,
                    noMoreSize: 10000
                }
            })



        },
        methods: {
            //下拉加载
            upCallback(page) {
                var _this = this;
                setTimeout(function () {
                    console.log(_this.createTab, '_this.createTab')
                    if (_this.createTab == 1) {
                        _this.getMyCreateClick(page.num)
                    } else {
                        _this.getMyAuditListClick(page.num)
                    }

                }, 1000)
            },

            back() {
                window.location.href = "airQuality.html?indexPage=1"
            },
            //tab切换
            tabChange(e) {
                this.contentList = []
                this.bgColor = e;
                this.styleFlag = e;
                this.title  = ''
                if (e == 0) {
                    this.createTab = 0;
                    this.searchTab = 1;
                    this.getMyAuditListClick(1);
                } else if (e == 1) {
                    this.createTab = 0;
                    this.searchTab = 2;
                    this.getMyAuditListClick(1);
                } else if (e == 2) {
                    this.createTab = 1
                    this.getMyCreateClick(1)
                }
            },
            detailsClick(e) {
                this.detailsId = e.id;
                window.location.href = "details.html?id=" + this.detailsId + '&type=' + this.bgColor;
            },
            inputChange(e) {
                console.log(e.target._value,'e.target._value')
              this.title = e.target._value;
              this.contentList = []
                if(this.createTab == 1){//申请
                    this.getMyCreateClick(1)
                }else{
                    this.getMyAuditListClick(1);
                }
            },
            //审核接口
            getMyAuditListClick(num) {
                this.loading = true
                axios({
                    url: utils.baseUrl + 'mediaAudit/getMyAuditList',
                    method: 'get',
                    headers: {
                        MAToken: this.MATokens
                    },
                    params: {
                        searchTab: this.searchTab,
                        page: num,
                        rows: 10,
                        title:this.title,
                    }
                }).then((res) => {

                    if (res.data.code == 200) {
                        this.loading = false
                        this.contentList = this.contentList.concat(res.data.result.mapList);
                        //下拉加载
                        if (this.contentList.length == 0) {
                            utils.customDialog.toast({
                                message: '暂无数据'
                            });
                        }

                        this.mescroll.endSuccess(res.data.result.listSize)
                    } else {
                        utils.jumpFunction(res.data)
                    }
                }).catch(function (err) {
                })
            },
            getMyCreateClick(num) {
                this.loading = true
                axios({
                    url: utils.baseUrl + 'mediaAudit/getMyCreateList',
                    method: 'get',
                    headers: {
                        MAToken: this.MATokens
                    },
                    params: {
                        page: num,
                        rows: 10,
                        title:this.title 
                    }
                }).then((res) => {
                    if (res.data.code == 200) {
                        this.loading = false
                        this.contentList = this.contentList.concat(res.data.result.mapList);
                        if (this.contentList.length == 0) {
                            utils.customDialog.toast({
                                message: '暂无数据'
                            });
                        }
                        console.log(res.data.result.listSize, 'res.data.result.listSize')
                        this.mescroll.endSuccess(res.data.result.listSize)
                    } else {
                        utils.jumpFunction(res.data)
                    }

                })
            }
        },
    })
</script>

</html>